<form class="register-modal-form" role="form" name="form" ng-submit="sendRegistration()">
  <div class="modal-header">
    <button type="button" class="close" ng-click="cancel()" ng-if="activationInfo.info.valid || registerWithAccountUrl">
      <span aria-hidden="true">&times;</span>
      <span class="sr-only">Close</span>
    </button>
    <div ng-switch="activationStep">
      <div ng-switch-when="1">
        <h3 class="modal-title">Register</h3>
      </div>
      <div ng-switch-default>
        <h3 class="modal-title">Activation</h3>
      </div>
    </div>
  </div>
  <div ng-switch="activationStep">
    <div ng-switch-when="1">
      <div ng-if="registerWithAccountUrl">
        <div class="modal-body">
          <p>
            Redirecting to register...
          </p>
        </div>
      </div>
      <div ng-if="!registerWithAccountUrl">
        <div class="modal-body form-horizontal">
          <ng-include src="'app/home/alerts/error/errorAlert.tpl.html'"></ng-include>
          <p>
            Before use, you must activate your copy of StreamSets Data Collector (SDC).
            Enter your contact information, and we will send you a key. If you already have a key,
            <a href="javascript:;" ng-click="goToKeyEntry()">enter the key here</a>.
          </p>
          <div class="form-group">
            <label class="control-label col-sm-3">First Name</label>
            <div class="col-sm-9">
              <input type="text" class="form-control" required maxlength="255"
                ng-model="activationData.firstName">
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-3">Last Name</label>
            <div class="col-sm-9">
              <input type="text" class="form-control" required maxlength="255"
                ng-model="activationData.lastName">
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-3">Company</label>
            <div class="col-sm-9">
              <input type="text" class="form-control" required maxlength="255"
                placeholder="Company or Organization Name"
                ng-model="activationData.companyName">
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-3">Work Email</label>
            <div class="col-sm-9">
              <input type="email" class="form-control" required maxlength="255"
                placeholder="name@mycompany.com"
                ng-model="activationData.email"
                autocomplete="email">
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-3">Role</label>
            <div class="col-sm-9">
              <select class="form-control"
                ng-model="activationData.role">
                <option value="">What I do...</option>
                <option value="Data Leader">Data Leader</option>
                <option value="Data Architect">Data Architect</option>
                <option value="Data Scientist">Data Scientist</option>
                <option value="Data Engineer">Data Engineer</option>
                <option value="Other">Other</option>
              </select>
            </div>
          </div>
          <div class="form-group">
            <label class="control-label col-sm-3">Country</label>
            <div class="col-sm-9">
              <select
                class="form-control"
                required
                ng-model="activationData.country">
                <option value="">Country...</option>
                <option value="United States">United States</option>
                <option value="Canada">Canada</option>
                <option value="Afghanistan">Afghanistan</option>
                <option value="Albania">Albania</option>
                <option value="Algeria">Algeria</option>
                <option value="Andorra">Andorra</option>
                <option value="Angola">Angola</option>
                <option value="Anguilla">Anguilla</option>
                <option value="Antigua and Barbuda">Antigua and Barbuda</option>
                <option value="Argentina">Argentina</option>
                <option value="Armenia">Armenia</option>
                <option value="Aruba">Aruba</option>
                <option value="Australia">Australia</option>
                <option value="Austria">Austria</option>
                <option value="Azerbaijan">Azerbaijan</option>
                <option value="Bahamas">Bahamas</option>
                <option value="Bahrain">Bahrain</option>
                <option value="Bangladesh">Bangladesh</option>
                <option value="Barbados">Barbados</option>
                <option value="Belarus">Belarus</option>
                <option value="Belgium">Belgium</option>
                <option value="Belize">Belize</option>
                <option value="Benin">Benin</option>
                <option value="Bermuda">Bermuda</option>
                <option value="Bhutan">Bhutan</option>
                <option value="Bolivia, Plurinational State of">Bolivia</option>
                <option value="Bosnia and Herzegovina">Bosnia and Herzegovina</option>
                <option value="Botswana">Botswana</option>
                <option value="Brazil">Brazil</option>
                <option value="British Indian Ocean Territory">British Indian Ocean Territory</option>
                <option value="Brunei Darussalam">Brunei</option>
                <option value="Bulgaria">Bulgaria</option>
                <option value="Burkina Faso">Burkina</option>
                <option value="Burundi">Burundi</option>
                <option value="Cambodia">Cambodia</option>
                <option value="Cameroon">Cameroon</option>
                <option value="Cape Verde">Cape Verde</option>
                <option value="Cayman Islands">Cayman Islands</option>
                <option value="Central African Republic">Central African Republic</option>
                <option value="Chad">Chad</option>
                <option value="Chile">Chile</option>
                <option value="China">China</option>
                <option value="Chinese Taipei">Taiwan</option>
                <option value="Colombia">Colombia</option>
                <option value="Comoros">Comoros</option>
                <option value="Congo">Congo</option>
                <option value="Congo, the Democratic Republic of the">Congo (Democratic Rep)</option>
                <option value="Cook Islands">Cook Islands</option>
                <option value="Costa Rica">Costa Rica</option>
                <option value="Cote d'Ivoire">Cote d'Ivoire</option>
                <option value="Croatia">Croatia</option>
                <option value="Cuba">Cuba</option>
                <option value="Curaçao">Curaçao</option>
                <option value="Cyprus">Cyprus</option>
                <option value="Czech Republic">Czech Republic</option>
                <option value="Denmark">Denmark</option>
                <option value="Djibouti">Djibouti</option>
                <option value="Dominica">Dominica</option>
                <option value="Dominican Republic">Dominican Republic</option>
                <option value="Ecuador">Ecuador</option>
                <option value="Egypt">Egypt</option>
                <option value="El Salvador">El Salvador</option>
                <option value="Equatorial Guinea">Equatorial Guinea</option>
                <option value="Eritrea">Eritrea</option>
                <option value="Estonia">Estonia</option>
                <option value="Ethiopia">Ethiopia</option>
                <option value="Fiji">Fiji</option>
                <option value="Finland">Finland</option>
                <option value="France">France</option>
                <option value="Gabon">Gabon</option>
                <option value="Gambia">Gambia</option>
                <option value="Georgia">Georgia</option>
                <option value="Germany">Germany</option>
                <option value="Ghana">Ghana</option>
                <option value="Greece">Greece</option>
                <option value="Greenland">Greenland</option>
                <option value="Grenada">Grenada</option>
                <option value="Guadeloupe">Guadeloupe</option>
                <option value="Guatemala">Guatemala</option>
                <option value="Guernsey">Guernsey</option>
                <option value="Guinea">Guinea</option>
                <option value="Guinea-Bissau">Guinea-Bissau</option>
                <option value="Guyana">Guyana</option>
                <option value="Haiti">Haiti</option>
                <option value="Honduras">Honduras</option>
                <option value="Hungary">Hungary</option>
                <option value="Iceland">Iceland</option>
                <option value="India">India</option>
                <option value="Indonesia">Indonesia</option>
                <option value="Iran, Islamic Republic of">Iran</option>
                <option value="Iraq">Iraq</option>
                <option value="Ireland">Ireland</option>
                <option value="Israel">Israel</option>
                <option value="Italy">Italy</option>
                <option value="Jamaica">Jamaica</option>
                <option value="Japan">Japan</option>
                <option value="Jordan">Jordan</option>
                <option value="Kazakhstan">Kazakhstan</option>
                <option value="Kenya">Kenya</option>
                <option value="Kiribati">Kiribati</option>
                <option value="Korea, Democratic People’s Republic of">Korea North</option>
                <option value="Korea">Korea South</option>
                <option value="Kuwait">Kuwait</option>
                <option value="Kyrgyzstan">Kyrgyzstan</option>
                <option value="Lao People's Democratic Republic">Laos</option>
                <option value="Latvia">Latvia</option>
                <option value="Lebanon">Lebanon</option>
                <option value="Lesotho">Lesotho</option>
                <option value="Liberia">Liberia</option>
                <option value="Libyan Arab Jamahiriya">Libya</option>
                <option value="Liechtenstein">Liechtenstein</option>
                <option value="Lithuania">Lithuania</option>
                <option value="Luxembourg">Luxembourg</option>
                <option value="Macao">Macao</option>
                <option value="Macedonia, the Former Yugoslav Republic of">Macedonia</option>
                <option value="Madagascar">Madagascar</option>
                <option value="Malawi">Malawi</option>
                <option value="Malaysia">Malaysia</option>
                <option value="Maldives">Maldives</option>
                <option value="Mali">Mali</option>
                <option value="Malta">Malta</option>
                <option value="Mauritania">Mauritania</option>
                <option value="Mauritius">Mauritius</option>
                <option value="Mexico">Mexico</option>
                <option value="Moldova, Republic of">Moldova</option>
                <option value="Monaco">Monaco</option>
                <option value="Mongolia">Mongolia</option>
                <option value="Montenegro">Montenegro</option>
                <option value="Morocco">Morocco</option>
                <option value="Mozambique">Mozambique</option>
                <option value="Myanmar">Myanmar</option>
                <option value="Namibia">Namibia</option>
                <option value="Nauru">Nauru</option>
                <option value="Nepal">Nepal</option>
                <option value="Netherlands">Netherlands</option>
                <option value="New Caledonia">New Caledonia</option>
                <option value="New Zealand">New Zealand</option>
                <option value="Nicaragua">Nicaragua</option>
                <option value="Niger">Niger</option>
                <option value="Nigeria">Nigeria</option>
                <option value="Norway">Norway</option>
                <option value="Oman">Oman</option>
                <option value="Pakistan">Pakistan</option>
                <option value="Panama">Panama</option>
                <option value="Papua New Guinea">Papua New Guinea</option>
                <option value="Paraguay">Paraguay</option>
                <option value="Peru">Peru</option>
                <option value="Philippines">Philippines</option>
                <option value="Poland">Poland</option>
                <option value="Portugal">Portugal</option>
                <option value="Qatar">Qatar</option>
                <option value="Romania">Romania</option>
                <option value="Russian Federation">Russian Federation</option>
                <option value="Rwanda">Rwanda</option>
                <option value="Saint Kitts and Nevis">St Kitts &amp; Nevis</option>
                <option value="Saint Lucia">St Lucia</option>
                <option value="Saint Vincent and the Grenadines">Saint Vincent &amp; the Grenadines</option>
                <option value="Samoa">Samoa</option>
                <option value="San Marino">San Marino</option>
                <option value="Sao Tome and Principe">Sao Tome &amp; Principe</option>
                <option value="Saudi Arabia">Saudi Arabia</option>
                <option value="Senegal">Senegal</option>
                <option value="Serbia">Serbia</option>
                <option value="Seychelles">Seychelles</option>
                <option value="Sierra Leone">Sierra Leone</option>
                <option value="Singapore">Singapore</option>
                <option value="Slovakia">Slovakia</option>
                <option value="Slovenia">Slovenia</option>
                <option value="Solomon Islands">Solomon Islands</option>
                <option value="Somalia">Somalia</option>
                <option value="South Africa">South Africa</option>
                <option value="South Sudan">South Sudan</option>
                <option value="Spain">Spain</option>
                <option value="Sri Lanka">Sri Lanka</option>
                <option value="Sudan">Sudan</option>
                <option value="Suriname">Suriname</option>
                <option value="Swaziland">Swaziland</option>
                <option value="Sweden">Sweden</option>
                <option value="Switzerland">Switzerland</option>
                <option value="Syrian Arab Republic">Syria</option>
                <option value="Tajikistan">Tajikistan</option>
                <option value="Tanzania, United Republic of">Tanzania</option>
                <option value="Thailand">Thailand</option>
                <option value="Togo">Togo</option>
                <option value="Tonga">Tonga</option>
                <option value="Trinidad and Tobago">Trinidad &amp; Tobago</option>
                <option value="Tunisia">Tunisia</option>
                <option value="Turkey">Turkey</option>
                <option value="Turkmenistan">Turkmenistan</option>
                <option value="Tuvalu">Tuvalu</option>
                <option value="Uganda">Uganda</option>
                <option value="Ukraine">Ukraine</option>
                <option value="United Arab Emirates">United Arab Emirates</option>
                <option value="United Kingdom">United Kingdom</option>
                <option value="Uruguay">Uruguay</option>
                <option value="Uzbekistan">Uzbekistan</option>
                <option value="Vanuatu">Vanuatu</option>
                <option value="Venezuela, Bolivarian Republic of">Venezuela</option>
                <option value="Viet Nam">Vietnam</option>
                <option value="Yemen">Yemen</option>
                <option value="Zambia">Zambia</option>
                <option value="Zimbabwe">Zimbabwe</option>
              </select>
            </div>
          </div>
          <div class="form-group" ng-if="activationData.country === 'United States' || activationData.country === 'Canada'">
            <label class="control-label col-sm-3">Postal Code</label>
            <div class="col-sm-9">
              <input type="text" class="form-control" required maxlength="10"
                placeholder="{{activationData.country === 'United States' ? '75198' : (activationData.country === 'Canada' ? 'A1A1A1': '')}}"
                ng-model="activationData.postalCode">
            </div>
          </div>
          <p>
            To activate your copy of StreamSets Data Collector (SDC), you must agree to our
            <a href="https://streamsets.com/legal/tos/" target="_blank">Terms of Service</a>
            and <a href="https://streamsets.com/privacy-policy/" target="_blank">Privacy Policy</a>.
          </p>
          <p>
            This product also automatically collects analytics data (which includes limited
            personal data) and is used by StreamSets to improve our products and inform our sales and marketing
            programs. You can find out more about what data is collected, how it is used,
            and your associated rights <a href="https://streamsets.com/privacy-policy/" target="_blank">here</a>,
            including how you may opt out of collection.
          </p>
          <div class="checkbox">
            <label>
              <input type="checkbox" ng-model="activationData.agreedToTerms">
              I have read and agree to the <a href="https://streamsets.com/legal/tos/" target="_blank">Terms of Service</a>
            </label>
          </div>
          <div class="checkbox">
            <label>
              <input type="checkbox" ng-model="activationData.agreedToPrivacyPolicy">
              I have read and acknowledge the <a href="https://streamsets.com/privacy-policy/" target="_blank">Privacy Policy</a>
            </label>
          </div>
        </div>
        <div class="modal-footer">
          <div class="loading-text" ng-if="operationInProgress">Registration may take up to 30 seconds</div>
          <button type="submit" class="btn btn-primary"
            ng-disabled="operationInProgress || !activationData.agreedToTerms || !activationData.agreedToPrivacyPolicy">
            <i class="fa fa-spinner fa-spin" ng-if="operationInProgress"></i>
            Agree to Terms and Register
          </button>
        </div>
      </div>
    </div>
    <div ng-switch-when="2">
      <div class="modal-body">
        <ng-include src="'app/home/alerts/error/errorAlert.tpl.html'"></ng-include>
        <p ng-if="showEmailSent">
          Please check your email ({{activationData.email}}) for the activation code.
          If you cannot find it (even in a spam folder) go back to the previous
          page to send another email. This dialog will close if you activate from the link
          in the email.
        </p>
        <p ng-if="expired">
          Your activation code has expired and you will need to get a new one from
          <a href="mailto:sales@streamsets.com">StreamSets</a>.
        </p>
        <div ng-if="!showEmailSent">
          Enter an activation code for product id:<br><pre>{{activationData.sdcId}}</pre>
        </div>
        <div class="form-group" ng-class="{'has-error': form.activationText.$error.pattern}">
          <label class="control-label">Activation Code</label>
          <textarea class="form-control" rows="13"
          ng-model="activationData.activationText"
          name="activationText"
          ng-pattern="/^\s*--------SDC ACTIVATION KEY--------[\s\S]*--------SDC ACTIVATION KEY--------\s*$/"
          required></textarea>
          <div>
            <span class="help-block"  ng-show="form.activationText.$error.pattern">
              The key must begin and end with <strong>--------SDC ACTIVATION KEY--------</strong>
            </span>
          </div>
        </div>
        <!-- Kept for future transformer use -->
        <!-- <div>
          <p>Or upload an activation file.</p>
          <div class="input-group" ng-hide="operationDone">
            <span class="input-group-btn">
                <span class="btn btn-primary btn-file">
                    {{'home.import.browse' | translate}}&hellip; <input type="file" fileread="uploadFile">
                </span>
            </span>
            <input class="form-control" readonly ng-model="uploadFile.name"
                  placeholder="{{'home.import.fileUploadPlaceholder' | translate}}">
          </div>
        </div> -->
      </div>
      <div class="modal-footer">
        <button type="reset" class="btn btn-default" ng-click="goToRegistration()" ng-hide="operationDone || operationInProgress || registerWithAccountUrl">
          Back
        </button>
        <button type="submit" class="btn btn-primary"
                ng-click="uploadActivationText()"
                ng-disabled="form.activationText.$invalid || operationInProgress">Activate</button>
      </div>
    </div>
    <div ng-switch-when="3">
      <ng-include src="'app/home/alerts/error/errorAlert.tpl.html'"></ng-include>

      <div class="alert alert-danger alert-dismissible" role="alert"
          ng-show="!activationInfo.info.valid">Activation key is not valid</div>

      <table class="table">
        <tbody>
        <tr>
          <td><label>Licensed to</label></td>
          <td>{{activationInfo.info.userInfo}}</td>
        </tr>
        <tr>
          <td><label>Expiration</label></td>
          <td>{{activationInfo.info.expiration === -1 ? 'N/A' : activationInfo.info.expiration | date:'medium'}}</td>
        </tr>
        <tr>
          <td><label>Licensed to SDC IDs</label></td>
          <td>{{activationInfo.info.validSdcIds}}</td>
        </tr>
        <tr>
          <td><label>SDC ID</label></td>
          <td>{{activationInfo.info.sdcId}}</td>
        </tr>
        </tbody>
      </table>

      <div class="modal-footer">
        <button type="reset" class="btn btn-default" ng-click="cancel()" ng-hide="operationDone || operationInProgress"
                translate="global.form.cancel">Cancel</button>

        <button type="reset" class="btn btn-default" ng-click="closeAndReload()" ng-show="operationDone"
                translate="global.form.close">Close</button>
      </div>
    </div>

    <div ng-switch-when="4">
      <div class="modal-body">
        <p>
          Congratulations, activation is complete! Reload to continue.
        </p>
      </div>

      <div class="modal-footer">
        <button type="reset" class="btn btn-primary"
          ng-click="closeAndReload()">Reload</button>
      </div>
    </div>
  </div>
</form>
